<template>
  <div class="nav">
    <div class="nav-job content">
      <router-link to="/wodewei"><span>返回</span></router-link>

      <div>登录</div>
      <router-link to="/mynotlog"><span>立刻注册</span></router-link>
    </div>
    <div class="head content">
      <img src="../../assets/images/头像.png" alt="" />
    </div>
    <div class="xixi content">
      <div>
        账号<input v-model="phone" placeholder="请输入您的注册的手机号" />
      </div>
      <div>
        密码<input v-model="phone1" placeholder="请确认您的密码6~12位" />
      </div>
    </div>
    <div class="btn content" @click="login">登录</div>
    <div class="dibu content">
      <router-link to="/wangji"><div>忘记密码?</div></router-link>
    </div>
  </div>
</template>
<style scoped>
.content {
  width: 100%;
  margin: 0 auto;
}
.nav-job {
  width: 375px;
  height: 88px;
  display: flex;
  justify-content: space-between;
  justify-content: space-around;
  line-height: 88px;
}
.nav-job span {
  color: #adadad;
}
.nav-job div {
  font-size: 36px;
}
.head {
  text-align: center;
}
.head img {
  width: 148px;
  height: 148px;
  margin-top: 20px;
}
.xixi {
  margin-top: 20px;
  text-align: center;
}
.xixi div {
  padding: 10px 0;
}
.btn {
  width: 300px;
  margin-top: 30px;
  text-align: center;
  background-color: rgb(9, 182, 116);
  border-radius: 25px;
  color: #fff;
  margin: 0 auto;
}
.dibu {
  margin-top: 160px;
  text-align: center;
  color: rgb(9, 182, 116);
}
</style>
<script setup>
import { useRoute,useRouter } from "vue-router";
import axios from "axios";
import { ref,reactive } from "vue";
const router = useRouter();
const route = useRoute();
let phone = ref("");
let phone1 = ref("");
function login() {
  

  axios({
  method: 'POST',
  url: 'https://fc-mp-827be4c1-176f-4e1f-985a-621b4417eadf.next.bspapp.com/api/user/pub/login',
  data: {
"username": phone.value, 
"password": phone1.value
}
})
.then((res)=>{
  router.push("/wodedenglu");
  console.log(res);
  localStorage.setItem("token", res.data.token);
});




let {uid,token,tokenExpired,userInfo}=res.data;
localStorage.setItem("uid", uid);
localStorage.setItem("token", token);
localStorage.setItem("tokenExpired", tokenExpired);
localStorage.setItem("userInfo", JSON.stringify(userInfo));
setTimeout(()=>{
  router.back();
},1000)
.catch((err)=>{
  console.log(err);
})
}




</script>
